document.addEventListener('DOMContentLoaded', function () {
    const inputJson = document.getElementById('input-json');
    const outputJson = document.getElementById('output-json');

    function formatJson(json) {
        try {
            const obj = JSON.parse(json);
            return JSON.stringify(obj, null, 2);
        } catch (e) {
            return 'Invalid JSON: ' + e.message;
        }
    }

    function updateOutput() {
        const input = inputJson.value.trim();
        if (input) {
            outputJson.textContent = formatJson(input);
        } else {
            outputJson.textContent = '';
        }
    }

    inputJson.addEventListener('input', updateOutput);

    // Initial update in case there's content in the textarea on load
    updateOutput();

    // Center the popup in the browser window
    function centerPopup() {
        const width = 800;
        const height = 600;
        const left = (screen.width / 2) - (width / 2);
        const top = (screen.height / 2) - (height / 2);

        window.resizeTo(width, height);
        window.moveTo(left, top);
    }

    // Call centerPopup when the popup is fully loaded
    window.addEventListener('load', centerPopup);
});

